<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Home</title>
    <meta name="description" content="">
    <link rel="stylesheet" href="__static__/layui/css/layui.css" media="all">

    <!-- Favicon -->

    <!-- Bootstrap CSS -->
    <link href="__static__//admin/index/assets/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
    <!-- Font Awesome CSS -->
    <link href="__static__//admin/index/assets/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
    <!-- Custom CSS -->
    <link href="__static__//admin/index/assets/css/style.css" rel="stylesheet" type="text/css"/>
    <!-- BEGIN CSS for this page -->
    <style>
        .flag {
            position: absolute; /*绝对定位*/
            height: 50px;
            line-height: 50px;
            text-align: center;
            width: 150px;
            font-weight: 500;
            background-color: #FF5722;
            color: #fff;
            font-size: 24px;
            border-top: 25px solid transparent;
            border-right: 26px solid #efefef;
            border-bottom: 25px solid transparent;
            border-top-left-radius: 5px;
            border-bottom-left-radius: 5px;
        }

        .flags {
            position: absolute; /*绝对定位*/
            height: 50px;
            line-height: 50px;
            text-align: center;
            width: 150px;
            font-weight: 500;
            background-color: #ffc107;
            color: #FF5722;
            font-size: 24px;
            border-top: 25px solid transparent;
            border-right: 26px solid #efefef;
            border-bottom: 25px solid transparent;
            border-top-left-radius: 5px;
            border-bottom-left-radius: 5px;
        }

        .flag-left {
            -moz-transform: rotate(360deg);
            -ms-transform: rotate(360deg);
            -o-transform: rotate(360deg);
            -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
            right: -5px;
            top: 5px;
        }

        .button {
            background-color: #4CAF50; /* Green */
            border: none;
            color: white;
            padding: 5px 10px !important;
            height: 25px !important;
            line-height: 16px !important;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            margin: 4px 2px;
            cursor: pointer;
            border-radius: 5px;
        }

        .button2 {
            background-color: #008CBA;
        }

        /* Blue */
        .button3 {
            background-color: #f44336;
        }

        /* Red */
        .button4 {
            background-color: #555555;
        }

        /* Red */
        .button5 {
            background-color: #FFB800;
            color: #FF5722;
        }

        /* Black */
        .s-text {
            position: absolute;
            display: block;
            margin-left: 15px;
            margin-top: -25px;
        }

        .bu-box {
            width: 100%;
            height: 40px;
        }

        .text-li {
            float: left;
            margin-left: 5px;
        }

    </style>

</head>
<body>


<!-- Left Sidebar -->
<!-- End Sidebar -->
<div class="content-page">
    <!-- Start content -->
    <div class="content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-xl-12">
                    <div class="breadcrumb-holder">
                        <h1 class="main-title float-left">欢迎...</h1>
                        <ol class="breadcrumb float-right">
                            <li class="breadcrumb-item">首页</li>
                            <li class="breadcrumb-item active">后台基本信息</li>
                        </ol>
                        <div class="clearfix"></div>
                    </div>
                </div>
            </div>
            <!-- end row -->
        <!--row 2 -->
        <hr class="layui-border-blue">
        <fieldset>
            <legend>信息统计</legend>
            <div class="row">
                <div class="col-xs-12 col-md-6 col-lg-6 col-xl-3">
                    <div class="card-box noradius noborder bg-default">
                        <i class="fa fa-first-order float-right text-white"></i>
                        <h6 class="text-white text-uppercase m-b-20">订单</h6>
                        <h1 class="m-b-20 text-white counter">{:empty($info.total_order)? '0': $info.total_order}</h1>
                        <span class="text-white">店铺总完成订单量</span>
                    </div>
                </div>

                <div class="col-xs-12 col-md-6 col-lg-6 col-xl-3">
                    <div class="card-box noradius noborder bg-warning">
                        <i class="fa fa-bar-chart float-right text-white"></i>
                        <h6 class="text-white text-uppercase m-b-20">当日订单</h6>
                        <h1 class="m-b-20 text-white counter">{:empty($info.order)? '0': $info.order}</h1>
                        <span class="text-white">当日成交订单量</span>
                    </div>
                </div>

                <div class="col-xs-12 col-md-6 col-lg-6 col-xl-3">
                    <div class="card-box noradius noborder bg-info">
                        <i class="fa fa-money float-right text-white"></i>
                        <h6 class="text-white text-uppercase m-b-20">总金额</h6>
                        <h1 class="m-b-20 text-white counter">{:empty($info.price)? '0': $info.price}</h1>
                        <span class="text-white">店铺总成交金额</span>
                    </div>
                </div>

                <div class="col-xs-12 col-md-6 col-lg-6 col-xl-3">
                    <div class="card-box noradius noborder bg-danger">
                        <i class="fa fa-money float-right text-white"></i>
                        <h6 class="text-white text-uppercase m-b-20">当日金额</h6>
                        <h1 class="m-b-20 text-white counter">{:empty($info.price)? '0': $info.price}</h1>
                        <span class="text-white">当日成交金额</span>
                    </div>
                </div>
            </div>
            <!-- end row -->
            <div class="row">
                <div class="col-xs-12 col-md-6 col-lg-6 col-xl-3">
                    <div class="card-box noradius noborder bg-default">
                        <i class="fa fa-user float-right text-white"></i>
                        <h6 class="text-white text-uppercase m-b-20">用户</h6>
                        <h1 class="m-b-20 text-white counter">{:empty($info.total_user)? '0': $info.total_user}</h1>
                        <span class="text-white">店铺用户总人数</span>
                    </div>
                </div>

                <div class="col-xs-12 col-md-6 col-lg-6 col-xl-3">
                    <div class="card-box noradius noborder bg-warning">
                        <i class="fa fa-user-o float-right text-white"></i>
                        <h6 class="text-white text-uppercase m-b-20">当日新增</h6>
                        <h1 class="m-b-20 text-white counter">{:empty($info.user)? '0': $info.user}</h1>
                        <span class="text-white">当日新增用户数</span>
                    </div>
                </div>

                <div class="col-xs-12 col-md-6 col-lg-6 col-xl-3">
                    <div class="card-box noradius noborder bg-info">
                        <i class="fa fa-user-circle float-right text-white"></i>
                        <h6 class="text-white text-uppercase m-b-20">充值金额</h6>
                        <h1 class="m-b-20 text-white counter">{:empty($info.total_charge)? '0': $info.total_charge}</h1>
                        <span class="text-white">店铺用户充值累计金额</span>
                    </div>
                </div>

                <div class="col-xs-12 col-md-6 col-lg-6 col-xl-3">
                    <div class="card-box noradius noborder bg-danger">
                        <i class="fa fa-vcard float-right text-white"></i>
                        <h6 class="text-white text-uppercase m-b-20">当日充值</h6>
                        <h1 class="m-b-20 text-white counter">{:empty($info.charge)? '0': $info.charge}</h1>
                        <span class="text-white">当日用户充值金额</span>
                    </div>
                </div>
            </div>
        </fieldset>
        <!-- end row -->
    </div>
    <!-- END container-fluid -->
</div>
<!-- END content -->
</div>
<!-- END content-page -->


<!-- END main -->
<script src="__static__//admin/index/assets/js/jquery.min.js"></script>
<script src="__static__//admin/index/assets/js/fastclick.js"></script>
<script src="__static__//admin/index/js/jquery.dataTables.min.js"></script>
<!-- Counter-Up-->
<script src="__static__//admin/index/assets/plugins/waypoints/lib/jquery.waypoints.min.js"></script>
<script src="__static__//admin/index/assets/plugins/counterup/jquery.counterup.min.js"></script>
<script src="__static__/layui/layui.js"></script>
<script>
    // setInterval("location.reload()",5000);
    var detail_url = '{:url("index/console_order")}';  //订单详情
    var alltail_url = '{:url("index/hang_order")}';  //订单详情
    var change_url = '{:url("order/change")}'; //接待订单
    var pay_url = '{:url("order/pay")}';  //订单支付
    var verify_url = '{:url("order/verify_url")}';  //订单核验
    var hang_url = '{:url("order/hang_order")}';  //挂单 合单
    layui.config({
        base: '__static__/admin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'form', 'table', 'common'], function () {
        var $ = layui.$
            , common = layui.common
            , form = layui.form
            , table = layui.table;


        //触发事件
        var active = {
            pay: function (othis) {   //订单支付
                var type = othis.data('type')
                    , text = othis.text();
                if (type == 0) {
                    layer.msg('暂无订单');
                    return true
                }
                common.tableStatus(pay_url, {id: type, state: 1}, setInterval("location.reload()", 2000), '是否支付订单');  //订单支付


            }, verify: function (othis) { //订单核验
                var type = othis.data('type')
                    , text = othis.text();
                if (type == 0) {
                    layer.msg('暂无订单');
                    return true
                }
                common.tableStatus(verify_url, {id: type, state: 1}, setInterval("location.reload()", 2000), '是否核验订单'); //订单核验

            }, opstate: function (othis) {  //接待订单
                var type = othis.data('type')
                    , text = othis.text();
                if (type == 0) {
                    layer.msg('暂无订单');
                    return true
                }
                common.tableStatus(change_url, {id: type, state: 2}, setInterval("location.reload()", 2000), '是否接待订单'); //接待订单
                // location.reload();
            }, opstates: function (othis) {  //接待订单
                var type = othis.data('type')
                    , text = othis.text();
                if (type == 0) {
                    layer.msg('暂无订单');
                    return true
                }
                common.tableStatus(change_url, {id: type, state: 3}, setInterval("location.reload()", 2000), '订单是否完成'); //接待订单
                // location.reload();
            },
            detail: function (othis) {   //订单详情
                var type = othis.data('type')
                    , text = othis.text();
                console.log(type, '=================>textddd<');
                if (type == 0) {
                    layer.msg('暂无订单');
                    return true
                }
                common.adminShow(detail_url + '?id=' + type, "订单详情", '80%', '80%', 'addEdit', ''); //订单详情
            },
            alldetail: function (othis) {   //合单订单详情
                var type = othis.data('type')
                    , text = othis.text();
                console.log(type, '=================>textddd<');
                if (type == 0) {
                    layer.msg('暂无订单');
                    return true
                }
                common.adminShow(alltail_url + '?id=' + type, "挂单订单详情", '80%', '80%', 'addEdit', ''); //订单详情
            },hangorder: function (othis) { //订单挂起
            var type = othis.data('type')
                , text = othis.text();
            common.tableStatus(hang_url, {id: type, state:1}, setInterval("location.reload()", 2000), '是否需要挂起（该单,及该桌挂起后直生成的订单直至合单的订单都是关联订单）'); //订单核验
        },closehang: function (othis) { //合单
                var type = othis.data('type')
                    , text = othis.text();
                common.tableStatus(hang_url, {id: type, state:0}, setInterval("location.reload()", 2000), '是否需要合单（该单和挂起的单，及该桌挂单后的订单都是关联订单）'); //订单核验
            }
        };
        $('#layerDemo .layui-btn').on('click', function () {
            var othis = $(this), method = othis.data('method');
            active[method] ? active[method].call(this, othis) : '';
        });


        $("#tipss").click(function () {
            layer.open({
                type: 1
                , area: ['700px', '620px']
                , title: ['订单流程说明', 'font-size:18px;']
                //,btn: '关闭'
                // ,btnAlign: 'c' //按钮居中
                // ,time: 10000 // 20000 = 20s后自动关闭
                , shade: 0.5 //遮罩透明度
                , shadeClose: true //点击遮罩关闭
                , moveType: 1 //拖拽模式，0或者1
                // ,yes: function(){ layer.closeAll();}
                , content: $("#tipstext") //这里content是一个普通的String
            });
        });

    });

    $(document).ready(function () {
        // data-tables
        $('#example1').DataTable();

        // counter-up
        $('.counter').counterUp({
            delay: 10,
            time: 600
        });
    });


</script>
<!-- END Java Script for this page -->

</body>
</html>